<template>
	<div class="contents">
		<van-nav-bar
		  title="装修状态"
		  left-text="返回"
			right-text="保存"
		  left-arrow
		  @click-left="onClickLeft"
		/>
		<div class="content">
			<van-row type="flex" justify="center" class="status-mt">
				<van-col span="12">
					<p class="buildsel">请选择您的装修状态</p>
				</van-col>
			</van-row>
			<van-row type="flex" justify="center">
				<van-col span="12">
					<div class="buildstat">装修前</div>
				</van-col>
			</van-row>
			<van-row type="flex" justify="center">
				<van-col span="12">
					<div class="buildstat">装修中</div>
				</van-col>
			</van-row>
			<van-row type="flex" justify="center">
				<van-col span="12">
					<div class="buildstat">装修后</div>
				</van-col>
			</van-row>
			<van-row type="flex" justify="center">
				<van-col span="12">
					<div class="buildstat">暂无装修计划</div>
				</van-col>
			</van-row>
<!-- 			<van-row type="flex" justify="center" class="status-mtb">
				<van-col span="12">
					<p class="buildsel">保存成功</p>
				</van-col>
			</van-row> -->
		</div>
	</div>
</template>

<script>
import Headerc from './Headerc'
import Vue from 'vue'
import { Row, Col, Cell, CellGroup } from 'vant'
Vue.use(Row).use(Col).use(Cell).use(CellGroup)

import { NavBar } from 'vant';
Vue.use(NavBar);
export default {
	data () {
		return {}
	},
	methods: {
		onClickLeft () {
			this.$router.go(-1)
		}
	},
	components: {
		Headerc
	}
}
</script>

<style lang="scss" scoped="scoped">
@import '@/lib/reset.scss';
.content {
	padding: 0 .1rem;
	box-sizing: border-box;
}
.buildsel {
	text-align: center;
}
.status-mt {
	margin: .5rem 0;
}
.buildstat {
	@include flexbox();
	@include justify-content();
	@include align-items();
	@include rect(1.5rem, .4rem);
	@include border(1px, #ccc, solid, null);
	@include border-radius(.5rem);
	margin: .2rem auto;
}
.status-mtb {
	margin-top: .2rem;
}
</style>
